﻿<!-- possible classes: minified, no-right-panel, fixed-ribbon, fixed-header, fixed-width-->
<header id="header">
    <!--<span id="logo"></span>-->
    <div id="logo-group">
        <span id="logo">
            <img src="Content/Themes/smart/img/logo.png" alt="SmartAdmin">
        </span>
        <!-- END AJAX-DROPDOWN -->
    </div>

</header>

<div role="main" id="main" style="margin-left:0;" ng-controller="LoginCtrl" sizeelement>

    <!-- MAIN CONTENT -->
    <div id="content" class="container">

        <div class="row">
            <div class="col-xs-12" style="margin: 0 auto;">
                <form id="login-form" class="smart-form client-form" name="loginform" novalidate ui-keypress="{13:'doLogin(user)'}"><!-- form-autofill-fix -->
                    <div class="alert alert-danger fade in" ng-show="showError && errorMessage!=''">
                        <strong>Error</strong> {{errorMessage}}
                    </div>
                    <div class="well no-padding" style="margin: 0 auto; width: 300px;">
                        <header>
                            Sign In
                        </header>
                        <fieldset>
                            <section>
                                <label class="label">Username</label>
                                <label class="input" ng-class="{'state-error': validate('UserName','required')}">
                                    <i class="icon-append fa fa-user"></i>
                                    <input type="text" name="UserName" ng-model="user.username" ng-class="{'invalid': validate('UserName','required')}" value="" autocomplete="off" required id="login-username" nois-focus auto-fill-sync/>
                                    <b class="tooltip tooltip-top-right"><i class="fa fa-user txt-color-teal"></i> Please enter username</b></label>
                                <em for="UserName" class="invalid" ng-show="validate('UserName','required')">Please enter your username</em>
                            </section>
                            <section>
                                <label class="label">Password</label>
                                <label class="input" ng-class="{'state-error': validate('Password','required')}">
                                    <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="Password" ng-model="user.password" value="" required ng-class="{'invalid': validate('Password','required')}" autocomplete="off" id="login-password" auto-fill-sync/>
                                    <b class="tooltip tooltip-top-right"><i class="fa fa-lock txt-color-teal"></i> Enter your password</b>
                                </label>
                                <em for="Password" class="invalid" ng-show="validate('Password','required')">Please enter your password</em>
                            </section>
                            <section>
                                <label class="checkbox">
                                    <input type="checkbox" name="remember" checked="" ng-model="user.remember">
                                    <i></i>Stay signed in
                                </label>
                            </section>
                        </fieldset>
                        <footer>
                            <button type="button" class="btn btn-primary" ng-click="doLogin(user)" ng-disabled="onSubmitting">
                                Sign in
                            </button>
                            <indicator class="fa-2x" style="float:right; margin:13px 0 0 5px; color:#2C3742" show="onSubmitting"></indicator>
                        </footer>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
